<template>
    <div class="management-merchant views-container">
        <div class="wlm-table">
          <div class="wlm-table-header">
              <el-dialog @close="clearReason" :visible.sync="dialogVisibleImg" width="30%" custom-class="reset-pwd wlm-form-dialog dialog-table">
        <div class="wlm-form" v-if="dialogVisibleImg">
            <div class="wlm-form-header wlm-dialog-fixheader">
                <span class="wlm-dialog-inlenr">拒绝审核</span>
            </div>
            <el-scrollbar wrap-class="scrollbar-wrapper">
                <div class="wlm-form-content">
                    <div class="wlm-dialog-main">
                        <div class="wlm-dialog-content">
                            <el-form :model="openDialogText" size="small" label-width="120px" class="retail-form" label-position="right">
                                <el-form-item label="原因">
                                    <el-input v-if="!isReasonText" type="textarea" :autosize="{ minRows: 4, maxRows: 4}" v-model="reason">
                                    </el-input>
                                    <p v-if="isReasonText">{{reasonText}}</p>
                                </el-form-item>
                            </el-form>
                        </div>
                    </div>
                </div>
            </el-scrollbar>
        </div>
        <footer class="flex-row flex-align-c flex-justify-c wlm-dialog-fixfooter">
            <el-button v-if="isReasonText" size="small" type="primary" @click="dialogVisibleImg=false">关闭</el-button>
            <el-button v-if="!isReasonText" size="small" type="primary" @click="reasonSave">确定</el-button>
        </footer>
    </el-dialog>
            <el-form  size="small" label-width="80px" class="retail-form" label-position="right">
                <el-form-item class="filter">
                    <el-form-item label="提现状态:">
                           <el-select v-model="tableFormatData.withdraw.files.status" placeholder="请选择">
                                 <el-option
                                    v-for="item in stutasdata"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                    </el-option>
                            </el-select>
                    </el-form-item>
                    <el-form-item label="所属代理:">
                          <el-select v-model="tableFormatData.withdraw.files.aid" placeholder="请选择">
                                <el-option
                                v-for="item in getAgentAlldata"
                                :key="item.id"
                                :label="item.agentname"
                                :value="item.id">
                                </el-option>
                            </el-select>
                    </el-form-item>
                </el-form-item>
                 <el-form-item label="" class="filter-btns">
                    <el-button v-waves type="primary" @click="filesSerch">筛选</el-button>
                    <el-button type="text" @click="filesEmpty">清空筛选条件</el-button>
                </el-form-item>
            </el-form>
     </div>
             <div class="wlm-table-content">
            <el-table  style="width: 100%" :ref="tableFormatData.withdraw.key" :data="tableFormatData.withdraw.tableData" @selection-change="handleSelectionChange">
                  <el-table-column label="代理信息">
                       <template slot-scope="scope">
                           <span>{{scope.row.agent_name}}</span>
                       </template>
                  </el-table-column>
                    <el-table-column label="申请渠道">
                       <template slot-scope="scope">
                           <span>{{scope.row.source}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="提现金额">
                       <template slot-scope="scope">
                           <span>{{scope.row.apply_pay}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="手续费">
                       <template slot-scope="scope">
                           <span>{{scope.row.sxf}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="到账金额">
                       <template slot-scope="scope">
                           <span>{{scope.row.deserved_pay}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="到账类型">
                       <template slot-scope="scope">
                           <span>{{scope.row.withdrawal_type}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="申请时间">
                       <template slot-scope="scope">
                           <span>{{scope.row.create_time}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="状态">
                       <template slot-scope="scope">
                           <span>{{scope.row.status_text}}</span>
                       </template>
                  </el-table-column>
                   <el-table-column label="操作" min-width="105">
                       <template slot-scope="scope">
                        <div class="operation-group">
                            <!-- <el-button v-if="scope.row.status==1||scope.row.status==2" class="wlm-text" type="text" @click="formFormatDialogEditEvt({id:scope.row.id, toggle:'dialogTableVisible',noEdit:true})">修改金额</el-button>
                            <div v-if="scope.row.status==1||scope.row.status==2" class="btn-line"></div> -->
                            <!-- <el-button v-if="scope.row.status==2&&scope.row.withdrawal_type=='wechat'" class="wlm-text" type="text" @click="entering(scope.row.id,2,'是否确认发放余额？')">发放余额(老版本打款)</el-button> -->
                           <el-button v-if=" scope.row.status==2" class="wlm-text" type="text" @click="entering(scope.row.id,2,'是否确认打款？')">打款</el-button>
                            <div v-if="scope.row.status==2" class="btn-line"></div>
                            <el-button v-if="scope.row.status==2" class="wlm-text" type="text" @click="entering(scope.row.id,7,'是否标记已打款？')">标记已打款</el-button>
                            <div v-if="scope.row.status==2" class="btn-line"></div>
                            <el-button v-if="scope.row.status==2" class="wlm-text" type="text" @click="entering(scope.row.id,9,'是否确认退回审核？')">退回审核</el-button>
                            <el-button v-if="scope.row.status==1" class="wlm-text" type="text" @click="entering(scope.row.id,scope.row.status,'是否确认通过审核？')">通过</el-button>
                            <div v-if="scope.row.status==1" class="btn-line"></div>
                            <el-button v-if="scope.row.status==1" class="wlm-text" type="text" @click="dialogVisibleImg=true,reasonId=scope.row.id">拒绝</el-button>
                            <span style="margin-right:10px;" v-if="scope.row.status==3">-</span>
                            <el-button v-if="scope.row.status==4" class="wlm-text" type="text" @click="dialogVisibleImg=true,reasonText=scope.row.reason,isReasonText=true">驳回原因</el-button>
                        </div>
                    </template>
                  </el-table-column>
            </el-table>
              <div class="pagination-content flex-row flex-justify-e flex-align-c">
                   <el-pagination :disabled="!hasTableData" @size-change="listPageChange" @current-change="listPageChange" :current-page.sync="tableFormatData.withdraw.pagination.page" :page-sizes="tableFormatData.withdraw.pagination.pagesizes" :page-size.sync="tableFormatData.withdraw.pagination.list_rows" layout="total, sizes, prev, pager, next, jumper" :total="hasTableData?tableFormatData.withdraw.pagination.total : 0">
                </el-pagination>
                </div>
        </div>
        </div>
    </div>
</template>
<script>
import {agentWithdrawalRecord,getAgentAll,agentWithdrawalOP} from "@/api/cityagent";
import waves from '@/directive/waves' // Waves directive
import mixins from '@/mixins/mixins'
export default {
      mixins: [mixins.getters('Table')],
     name: 'withdraw',
       directives: {
    waves
  },
    data () {
        return {
            reason:'',
            reasonId:'',
             isReasonText: false,
             reasonText:'',
           getAgentAlldata:[],
           dialogVisibleImg:false,
           openDialogText: {},
           stutasdata:[
              { value: '1',label: '待审核'},
              { value: '2',label: '待打款'},
              { value: '3',label: '已打款'},
              { value: '4',label: '已驳回'},
           ],
             tableFormatData: {
        current: 'withdraw',
        withdraw: {
          key: 'withdraw',
          api: {
            getList: agentWithdrawalRecord,
            // delList: deleteAgentUser,
          },
          tableData: [],
        //   otherData:{
        //     money_type:''
        //   },
          files: {
            ids: [],
            time:[],
          },
          pagination: {
            page: 1,
            list_rows: 10,
            pagesizes: [10, 20, 50],
            total: 0
          }
        }
      }
        }
    },
    created () {
       this.$nextTick(()=>{
            this.getAgentAllbtn()
        })
    },
    methods: {
         clearReason() {
      this.reason = ''
      this.reasonId = ''
      this.isReasonText = false
      this.reasonText = ''
    },
    reasonSave() {
      if (this.reason === '') {
        this.$message({
          type: 'error',
          message: '请填写拒绝原因!'
        })
      } else {
        agentWithdrawalOP({ id: this.reasonId, status: 8, reason: this.reason }).then((response) => {
          const { data: { code, data, msg } } = response
          console.log(data)
          if (code === 1) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
            this.dialogVisibleImg = false
            this.filesSerch()
          } else {
            this.$message.error(msg)
          }
        })
      }
    },
        getAgentAllbtn(){
            getAgentAll().then(res=>{
                if(res.data.code==1){
                    this.getAgentAlldata = res.data.data
                }
            })
        },
     entering(id, a_status, noticeMsg) {
      this.$confirm(noticeMsg, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        agentWithdrawalOP({ id: id,status:a_status}).then((response) => {
          const { data: { code, data, msg } } = response
          console.log(data)
          if (code === 1) {
            this.$message({
              type: 'success',
              message: '审核成功!'
            })
            this.filesSerch()
          } else {
            this.$message.error(msg)
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },
    enteringbtn(id,daMsg){
        this.$confirm(daMsg,'提示',{
             confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
        }).then(()=>{
            agentWithdrawalOP({id:id}).then(res=>{
                 const { data: { code, data, msg } } = res
                 if (code === 1) {
                    this.$message({
                    type: 'success',
                    message: '打款成功!'
                    })
                        this.filesSerch()
                    } else {    
                        this.$message.error(msg)
                    }
                        })
        })
    },
    enteringsign(id,daMsg){
        this.$confirm(daMsg,'提示',{
             confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
        }).then(()=>{
            agentWithdrawalOP({id:id}).then(res=>{
                 const { data: { code, data, msg } } = res
                 if (code === 1) {
                    this.$message({
                    type: 'success',
                    message: '标记已打款成功!'
                    })
                        this.filesSerch()
                    } else {    
                        this.$message.error(msg)
                    }
                        })
        })
    },
    }
}
</script>